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Aspectos Importantes 


e A evolução gráfica dos jogos tende a aumentar cada 
vez mais. 


e Será exigido dos desenvoveldores jogos com mais 
realismo gráfico, renderizados com um número de 
Quadros Por Segundo (Frames Per Second - FPS) 
que transmita a impressão de continuidade nas 
animações. 

e Esta evolução será comprometida se apenas soluções 
do tipo força-bruta, que dependem totalmente no 
poder de processamento de hardwares cada vez mais 
avançados. Novas técnicas deverão ser utilizadas 
em conjunto com hardwares mais potentes. 


Tópicos da Apresentação 


Pipeline Gráfico. 


Pipeline 


e Estrutura com vários estágios, onde os elementos de 
um (ou vários) tipo(s) fluem entre estes, 
sequencialmente, até atingir o fim da estrutura. 


e Em cada estágio, operações podem ser efetuadas nos 
elementos vindos do estágio anterior e repassados 
para o próximo. 

e Idealmente, uma tarefa de n estágios realizada sem 
a divisão em pipeline, tem um aumento de n 
processos completos por unidade de tempo quando 
dividida em pipeline. 


Exemplos de Pipelines 
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Exemplos de Pipelines 
Indústria Automobilística 


Pipeline Gráfico 


e O processo de renderização de imagens também é do 
tipo pipeline. 

e Os elementos de entrada que fluem pelos estágios 
São informações referentes aos objetos a serem 
exibidos - posição, cor, orientação - e a saída são 
imagens 2D - pixeis. 


Pipeline Gráfico 
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Aplicação 


e Aplicação é o estágio do pipeline gráfico feita 
completamente em software, sobre a qual o 
desenvolvedor tem completo controle sobre o que 
fazer. 


e Neste estágio se definem os objetos, suas 
características animações, entre outros. 


e Operações típicas deste estágio são deteção de 
colisão, processamento da entrada do usuário, e 
outras otimizações. 


Exemplos de Aplicações 
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Exemplos de Aplicações 
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Batman: Arkham Knight - Rocksteady 


Definições 


e Estágios Funcionais: estágios que definem a 
execução de alguma tarefa, mas não como esta deve 
ser realizada. 


e Estágios de Pipeline: são executados 
simultâneamente com todos os outros estágios do 
pipeline. 

e Estátios de pipeline podem ser implementados em 
paralelo para otimizar o processo e dois ou mais 
estágios funcionais podem ser englobados em um 
Único estágio de pipeline. 


Pipeline Gráfico 


Aplicação D> Geometria 


Pipeline Gráfico - Geometria 


e Este estágio possui a maioria das operações que 
podem ser realizadas nos objetos, polígonos a serem 
exibidos. 


e O estágio pode ser dividido em vários estágios 
funcionais que podem ou não ser equivalentes aos 
estágios de pipeline, ou serem implementados em 
vários estágios de pipeline menores, ou agrupados 
em estágios de pipeline macros, ou modificar a 
ordem de execução. 


Pipeline Gráfico - Geometria 


Mapeamento 
na tela 


Pipeline Gráfico - Geometria 


Estágio de Transformação 


e Transformação envolve mudar o sistema de 
coordenada dos objetos (chamdo de Sistema de 
Coordenadas do Modelo SCM - Model Coordinate 
System) a serem renderizados para sistemas mais 
adequados. 


e O que sofre a transformação nos objetos são seus 
vértices e os vetores normais associados a eles. Esta 
transformação recebe o nome de Model Transform 

e Após a transformação ser aplicada, diz-se que os 
objetos estão no Sistema de Coordenadas do Mundo 
SSM (World Coordinate System). 


Sistemas de Coordenadas do Modelo 


Estágio de Transformação 


e (Os modelos de computação gráfica definem um 
objeto especial em uma cena denominado Câmera, 
que serve para capturar a regiao da cena vista no 
dispositivo de saída. 

e Esta região visível para a câmera se chama Volume 
de Visualização 

e A Câmera também possui coordenadas e orientação 
no SSM que irá sofrer uma transformação. 


Câmera com o volume de 
vizualização 
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Estágios de Transformação 


Para facilitar outras operações no estágio de 
Geometria, as coordenadas dos objetos e da câmera 
São transformados com a View Transform. 


Seu objetivo é localizar a câmera em uma posição 
especial (em geral a origem) apontando para uma 
dada direção (eixo Z, no sentido positivo ou 
negativo). 

Em geral as duas tranformações são concatenadas 
em uma única chamada Model View Transform. 


Model View Transform 
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Pipeline Gráfico - Geometria 


Estágio de Projeção 


e Projeção transforma o volume de visualização da 
câmera em um cubo de volume unitário com 
extremidades (-1,-1,-1) e (1,1,1). 

e Os dois tipos de projeção mais utilizados são: 
ortográfica (ou paralela) e perspectiva. 


Estágio de Projeção 


e Projeção Ortográfica torna o volume de 
vizualização em um cubo retangular. Sua principal 
característica é manter os objetos do mesmo 
tamanho, independente da sua distância em relação 
a camera 


Projeção Ortográfica 
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Estágio de Projeção 


e Projeção em Perspectiva exibe os objetos com 
tamanhos maiores ou menores, conforme estiverm 
mais próximos ou mais distantes da câmera. Volume 
de visualização se torna um frustum. 


Projeção em Perspectiva 
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Pipeline Gráfico - Geometria 


Estágio de Clipping 


e Clipping é o processo que determina quais objetos 
estão parcial ou completamente dentro do volume de 
visualização. 


Clip Rectangle 


Pipeline Gráfico - Geometria 


Estágio de Mapeamento na 
Tela 


Mapeamento na Tela é transformar e escalonar as 
coordenadas X e Y dos objetos para as coordenadas 
X" Y” de uma região, em geral retangular, no 
dispositivo de saída. 

A coordenada Z não sofre alteração. Esta coordenada 
é armazenada em uma região especial da memória 
chamada Z-Buffer desde o estágio de projeção. 


Estágio de Mapeamento na 
Tela 
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Pipeline Gráfico 
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Pipeline Gráfico — 
Rasterização 


e Rasterização pega todas as informações dos objetos já 
projetados, iluminados, e que passaram pelos outros 
estágios e transforma estas em pixeis para serem 
renderizados. 


e Em geral esta etapa trabalha com dois buffers (front e 
back) para que o observador veja apenas a imagem final e 
não o processo da renderização. 


e Determinação de visibilidade, ou sobreposição, dos objetos 
também é feita neste estágio. Se dois objetos possuem 
regiões em um mesmo pixel, o rasterizador irá exibir 
somente aquele que tiver a coordenada Z mais próxima da 
camera. 


Tópicos da Apresentação 


e Modelos de Iluminação. 


Definições 


e Lighting refere-se ao processo de interação entre as 
propriedades dos objetos e as luzes presentes em 
uma cena. 


e Shading é o processo de se executar lighting para 
determinar as cores finais dos pixeis. 


Iluminação em um ponto 


N = surface normal 
L = vector to light 
V= vector to eye (view vector) 
R = reflection vector 


Principais Algoritmos de 
Iluminação 
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Tópicos da Apresentação 


e Shaders, Vertex, Geometry, Tesselation e 
Fragment Shaders. 


Shader Histórico 


e Paradigma Procedural é substituir a utilização de 
dados pré-computados em algumas operações por 
algoritmos que os calcula em tempo real. 


e Na área gráfica o paradigma procedural foi 
incentivado principalmente pela aparição da 
especificação do Renderman. 


e Esta especificação trouxe o conceito de Shader 
Language, uma linguagem que permite implementar 
descrições complexas de como as operações de 
lighting e shading podem ocorrer. 


Shaders 


e Shaders são programas escritos em liguagens 
apropriadas que permitem substituir certas 
operações existentes no pipeline gráfico 
implementadas em hardware. 

e A especificação Renderman introduziu vários tipos de 
Shaders: light source shaders, volume shaders, 
transformation shaders, surface shaders entre 
outros. 


e Do ponto de vista de aplicações em jogos, os 
hardwares disponíveis costumam implementar três 
tipos de shaders: Vertex Shader, Geometry, 
Tesselation e Fragment Shader 


Vertex Shaders 


e Vertex Shader: são shaders que podem alterar os 
parâmetros dos vértices de um polígono, como a sua 
cor, seu vetor normal, suas coordenadas de textura. 

e Pode-se conseguir alguns efeitos interessantes com 
vertex shaders: sombras volumétricas, motion blur, 
silhuetas, deformações procedurais como cabelos, 
agua. 


Vertex Shaders Exemplos 


Simulação de Água 


Motion Blur 


Geometry Shader 


e Geometry Shaders podem adicionar ou remover 
vértices de uma malha quando esta já está no 
pipeline gráfico. Pode ser utilizado para adicionar 
conteúdo geométrico proceduralmente. 


e Função do GS é permitir os mesmos recursos que VS 


mas criando-os em tempo real na GPU, reduzindo o 
tempo de processamento. 


Geometry Shaders Exemplos 


Volumetric Shadows 


Tesselation Shader 


e Tesselation Shaders envolvem subdividir uma 
malha e calcular novos valores para os vértices 
(posição, normal, cor, coordenada de texturas). 


Tesselation Shaders 
Exemplos 


Tessellation Off Tessellation On 
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Fragment Shader 


Fragment Shader, também chamado de Pixel 
Shader, são operações que podem atuar 
modificando valores associados a pixeis individuais. 


Estas operações podem atuar em valores individuais, 
interpolados ou em mapas de texturas para 
produzirem a cor do pixel. 


Qualquer operação que se realiza nos pixels após a 
geração do Frame é chamado de Fragment ou Pixel 
Shader. 

Uma forma bastante utilizada atualmente de pixel 
Shader é substituir o cálculo do vertor normal dos 
vertex por um mapa de normais. 


Fragment Shaders Exemplos 


Referências 


Livro Essential Mathematics for Games and 
Interactive Applications 


Site, Essential Math for Game Programmers 


Indispensável: Vetores, Matrizes e 
Transformações Afins. 


Livro Unity Shaders and Effects Cookbook 


Referências 


GLSL Wiki Book 
Cg Wiki Book 


Cg Tutorial 


Palestra oficial 


Referências 


- Videos tutoriais em SurfaceShaders 


- Blog de Adrian Courreges 


* Blog de Fabien Sanglards 


Games from Scratch 


e Handmade Hero 


- Ginger Games 


Shaders no Unity 


* Escritos na linguagem ShaderLab baseado na linguagem Cg 
da nVidia. 


- 4 Tipos: 


1. 


Fixed Function Shaders: para hardwares antigos e 
efeitos mais simples. 


Surface Shaders: melhor opção para efeitos de 
interação com lighting e shadow 


Vertex e Fragment Shaders: mais flexíveis mas mais 
dificeis de escrever. 


Em Windows é possível escrever direto em DX11. 


Esquema geral de Shaders 


Shader 
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Definition 


Subshader is 
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Fallback 


Properties 


* Equivalente a variáveis em uma classe: 
* Properties ( Name (“DisplayedName”, type) = value ) 
* Tipos: 

* Color 

- 2D (Texture potência de 2) 

- Rect (Textura, qualquer dimensão) 

* Cube (Cube Map Texture) 

* Range (min, max) 

* Float 

* Vector 


Referências 


Properties Exemplo 


Properties ( 
“Wamescale ("Wave scale”, Range: 40,02,0:15)) = 040% 
-Retlbrstorte (CRetlcection distort”, Range. (0,599) = 
RefrDistort: (retraction distort”, Range (0,1.5)) 


-Refrcolor (Frefractiorn color", Colorj = (54. 485; 
-BetlectironTex (Environment Refleceron"a 2ZDj =P di 
“Reftractiontex (Environment Retracrion',. 20) = MEL) 
- Eresmnel (orresnel (A) o ZD) = ld 


'"BumpMap ("Bumpmap (RGB) ", 2D) = "" () 


Subshaders 


Equivalente a funções numa classe: 


Cada Pass corresponde a uma interação em um Loop para 
modificar a aparência da imagem. 


https://wWww.youtube.com/watch?v=kEgLGKTQUVO 


Subshaders Fixed - Texture 


* Texturas são setadas com o comando: 


petlexture| Namel. 


Gio jono jo 


- Sendo que código é uma combinação de ações entre 
o resultado da passagens (Pass) de SetTexture 
anterior com O SetTexture atual. 


Cg/ShaderLab Tipos de 


* vec2 xyCoordinate; 
* filoatá color: 
* -Elodts múultiplsedcolLor = color. rgb: * cooradarnate.s; 


- Tipos dos parâmetros de entrada e retorno são 
definidos como struct, sendo que o de saída 
costuma ser sempre o mesmo, SurfaceOutput. 
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Fixed Function Shaders 
Strumpy Editor 


Pixel Graph 


Color: DiffuseColor 


Color: RimColor 
Multiply 


Fresnel ViewDirection 


Range: Glossiness 


Range: RimPower 


Color: SpecularColor 


RGBA 


Draw Background ——— 
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Shader Forge 
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